<template>
	<view>
		<view class="load_more_wrapper" v-if="status&&status != 'empty'">
			<!-- 上拉加载更多 -->
			<text class="foot-text" v-if="status == 'getmore'">{{ getmoreTitle }}</text>
			<!-- 加载中 -->
			<view class="loading" v-else-if="status == 'loading'">
				<!-- 转圈圈 -->
				<view class="weui-loading"></view>
				<view class="load-text">加载中</view>
			</view>
			<text class="foot-text" v-else-if="status == 'nomore'">没有更多了～</text>
			<text class="foot-text" v-else-if="status == 'error'">数据加载失败，请检查网络</text>
			<!-- <text class="foot-text" v-else-if="status == 'empty'">没有任何数据！</text> -->
		</view>
		<list-empty v-if="status == 'empty'"  :status="status" :text="text" :defaultIcon="defaultIcon"></list-empty>
	</view>
</template>

<script>
export default {
	name: 'load-more',
	props: {
		status: {
			type: String,
			default: 'loading'
		},
		text:{
			type: String,
			default: '暂无任何数据'
		},
		getmoreTitle: {
			type: String,
			default: '上拉加载更多'
		},
		styleBg: {
			type: String,
			default: 'transparent'
		},
		// 有俩张缺省图，0有带问号，1，没有带问号那张图
		defaultIcon:{
			type: [Number,String],
			default: 0
		}
	}
};
</script>

<style lang="scss">
.load_more_wrapper {
	padding: 40rpx 32rpx;
	box-sizing: border-box;
	.foot-text {
		color: #999;
		display: block;
		text-align: center;
		width: 100%;
		font-size: 28rpx;
	}
	.loading {
		color: #999;
		text-align: center;
		width: 100%;
		font-size: 28rpx;
		display: flex;
		justify-content: center;
	}
	.load-text {
		margin-left: 16rpx;
	}
}
</style>
